<template>
  <div class="juan">
    <div class="t">
      <van-nav-bar
        title="可用优惠券"
        right-text="查看无效劵"
        left-arrow
        @click-left="onClickLeft"
      />
    </div>

    <div class="xia">
      <div class="yi">
        <van-cell
          title="指定饮品劵"
          value="1.8折" size="large"
          label="有效期至2019-12-12"
          value-class='color'
          title-style="font-size:18px;"
        />
        <van-cell
          title="使用规则"
          value="立即使用"
          size="large"
          value-class='color1'
          title-style="font-size:14px;"
        />
      </div>
    </div>

  </div>
</template>

<script>
export default {
  data() {
    return {

    }
  },
 methods: {
    onClickLeft() {
      this.$router.push({name:'Me'});
    }
  }
}
</script>
<style scoped>
.juan{
  width: 100%;
  background: ghostwhite;
}
.xia{
  padding: 20px;
}
.yi{
  height: 120px;
}
.color{
  color: skyblue;
  font-size: 22px;
}
.color1{
  color: skyblue;
  font-size: 16px;
}
</style>
